<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script type="text/javascript">
	
window.onload = function(){
	// 抓元素
	var btn = document.getElementById('btn');
	var box = document.getElementById('box');

	var sta = 1;

	// 给按钮加单击事件
	btn.onclick = function(){
		if(sta==1){
			sta =2;
			// 设置定时器，每隔一段时间就改变width
			setInterval(function(){
				// 获得当前的width
				var old_width = box.style.width;
				// 计算新的宽度
				var new_width = parseInt(old_width)+3;
				// 将新的宽度赋值回去
				box.style.width = new_width+'px';
			},200)
		}
		
	}
}


</script>
</head>

<body>

<input type="button" value="点我" id="btn" />
<br /><br />
<div id="box" style="width:200px;height:200px;background:blue;"></div>


</body>
</html>
